<template>
	<view class="p_bg_f3 p_bg_all p_b_128">
		<view class="p_lr_32">
			<listDataView :index="index" :item="item" :deleteState="false" v-for="(item, index) in listData"
				@getChoose="getChoose" @getIsChoose="getIsChoose" @getChooseNum="getChooseNum">
			</listDataView>
		</view>
		<view class="p_flex9 p_bg_fff p_bottom">
			<view class="p_flex2" @click="getAllPrint">
				<image src="https://dy.sykj365.com/uploads/mini/weixuanzhong@2x.png" class="p_img_48 p_margin_r_8" v-if="!isAllChoose">
				</image>
				<image src="https://dy.sykj365.com/uploads/mini/xuanzhong@2x.png" class="p_img_48 p_margin_r_8" v-else></image>
				<view class="p_font_24 p_color_7a">全选</view>
			</view>
			<view class="p_flex2">
				<input v-model="name" placeholder="请输入分享清单名称" placeholder-class="p_font_26 p_color_b2"
					class="p_font_26" />
				<view class="p_btn" @click="getAdd">
					<view>创建</view>
				</view>
			</view>
		</view>
		<!--  -->
		<van-dialog use-slot :show="isShow" confirm-button-text="我知道了" @confirm="isShow = false">
			<view class="modal_content">
				<view class="p_font_28 title">
					<view>分享清单是什么？</view>
				</view>
				<view class="p_font_26" style="line-height: 44rpx;">
					创建分享清单后分享给好友，好友点击可查看清单内的文件并一键加入打印列表，实现资料共享，方便一份资料多人多次印刷
				</view>
			</view>
		</van-dialog>
	</view>
</template>

<script>
	import listDataView from '../../components/listData.vue';

	export default {
		components: {
			listDataView
		},
		data() {
			return {
				isShow: true,
				listData: [],
				isAllChoose: false,
				name: '',
			}
		},
		onLoad() {
			this.getListData();
		},
		methods: {
			getListData() {
				this.$http.post(this.$api.cartList).then(res => {
					if (res.data.length > 0) {
						res.data.map((n) => {
							if (n.choose == undefined) n.choose = false;
							return n
						})
					}
					this.listData = res.data;
				})
			},
			getChoose(i) {
				// 列表选中
				if(!this.listData[i].paper) return getApp().getMsg('请选择已设置文件');
				this.listData[i].choose = true;
				this.getAllFun();
			},
			getIsChoose(i) {
				// 列表取消
				this.listData[i].choose = false;
				this.getAllFun();
			},
			getAllFun() {
				let s_ = true;
				this.listData.forEach((n) => {
					if (!n.choose) s_ = false;
				})

				if (s_) this.isAllChoose = true;
				if (!s_) this.isAllChoose = false;
			},
			getChooseNum(item) {
				let n_ = this.listData[item.index].num;

				if (item.type == 0 && n_ == 1) return;

				if (item.type == 0 && n_ != 1) {
					n_--;
				}
				if (item.type == 1) {
					n_++;
				}

				this.$http.post(this.$api.numEdit, {
					id: this.listData[item.index].id,
					num: n_
				}).then(res => {
					this.listData[item.index].num = n_;
				})
			},
			getAllPrint() {
				this.isAllChoose = !this.isAllChoose;

				this.listData.forEach((n) => {
					if (this.isAllChoose) n.choose = true;
					if (!this.isAllChoose) n.choose = false;
				})
			},
			getAdd() {
				let ids = [];
				this.listData.forEach((n) => {
					if (n.choose) {
						ids.push(n.id)
					}
				})

				if (!this.name) return getApp().getMsg('请输入分享清单名称');
				if (ids.length === 0) return getApp().getMsg('至少选择一个文件');

				this.$http.post(this.$api.addShare, {
					name: this.name,
					ids: ids.toString()
				}).then(res => {
					uni.redirectTo({
						url: '/pages/my/shareList'
					});
				})
			}
		}
	}
</script>

<style lang="less">
	.modal_content {
		padding: 32rpx;
	}

	.title {
		display: flex;

		view {
			padding: 12rpx 36rpx;
			border-radius: 48rpx;
			background-color: rgba(5, 181, 112, 0.16);
			margin-bottom: 15rpx;
		}
	}

	.p_bottom {
		position: fixed;
		bottom: 0;
		width: 100%;
		padding: 18rpx 32rpx 38rpx;
		box-sizing: border-box;
		box-shadow: 0px 5rpx 20rpx #F3F3F3;

		input {
			width: 300rpx;
			height: 72rpx;
			padding: 0 12rpx;
			box-sizing: border-box;
			border: 1px solid #05B570;
			border-radius: 16rpx 0 0 16rpx;
		}
	}

	.p_btn {
		margin: 0;
		width: 130rpx;
		border-radius: 0 16rpx 16rpx 0;
	}
</style>
